<template>
  <dashboard-page
    v-if="!loading && pageInfo.type === '可视化'"
    :pageInfo="pageInfo"
  />
  <div
    v-if="loading"
    class="business-page-container"
    v-loading="loading"
    element-loading-text="数据加载中..."
  />
</template>

<script setup>
import { ref, provide, watch } from 'vue';
import DashboardPage from "@/dashboard/view/page.vue";
import { getPage } from '@/utils/codeless';
import { useRoute } from 'vue-router'

const route = useRoute()
const loading = ref(true);
const pageInfo = ref({});
provide('menuId', 'dashboard');

const init = async(pageId) => {
  loading.value = true;
  pageInfo.value = await getPage(pageId);
  loading.value = false;
};

watch(() => route.params.dashboardId, (pageId) => {
  init(pageId);
}, {immediate: true});
</script>

<style scoped>
.business-page-container {
  height: 100%;
  display: flex;
  flex-direction: column;
}
</style>